<template>
	<div>
		<div class="detail" v-html="list">
		</div>
		<div class="floor">
			<div class="floor_sub">
				<div class="one" @click="Jump">
						<i></i>
						<div class="shu"></div>
					</div>
					<div class="two">
						<i></i>
					</div>
					<div class="three" @click="fabulous">
						<i class="three_one" v-show="isShow2"></i>
						<i class="three_two" v-if="isIf2"></i>
						<div>{{ num }}</div>
					</div>
					<div class="four" @click="collection">
						<i class="four_one" v-show="isShow"></i>
						<i class="four_two" v-if="isIf"></i>
					</div>
					<div class="five">
						<i></i>
					</div>
				</div>
			</div>
		<div class="box8"></div>
	</div>
</template>

<script>
	export default {
		data: function() {
			return {
				list: '',
				src:'',
				id:'',
				access_token:'',
				key:true,
				isShow:true,
				isIf:false,
				isShow2:true,
				isIf2:false,
				num:'2',
			}
		},
		updated() {
			this.getNode()
			this.getSee()
		},
		mounted() {
			this.getListDetail()
			let userinfo = JSON.parse(localStorage.getItem('userinfo'))
			console.log(userinfo)
			this.id = userinfo.id
			this.access_token = userinfo.access_token
		},
		methods: {
			getListDetail: function() {
				this.$axios.get('http://chonghekj.com/daily/index.php/Home/daily/detail', {
					params: {
						id: this.$route.query.id
					}
				}).then((res) => {
					this.list = res.data.body
					this.src = res.data.image
				})
			},
			getNode:function(){
				if(this.key){
					let img =document.createElement('img');
					img.className = 'picture2';
					img.src = this.src;
					document.querySelector('.img-place-holder').appendChild(img);
					this.key = false
				}
			},
			collection:function(){
				this.$axios.post('http://chonghekj.com/daily/index.php/Home/daily/doAct',this.$qs.stringify({
					pid:this.$route.query.id,
					uid:this.id,
					access_token:this.access_token,
					acttype:'collect'
				}))
				.then((res)=>{
					console.log(res)
					this.getSee()
				})
			},
			getSee:function(){
				this.$axios.post('http://chonghekj.com/daily/index.php/Home/daily/detailState',this.$qs.stringify({
					pid:this.$route.query.id,
					uid:this.id,
					access_token:this.access_token,
				})).then((res)=>{
					console.log(res)
					this.num = res.data.data.like
					if(res.data.data.iscollect == 1){
						this.isShow = false
						this.isIf = true
					}else{
						this.isShow = true
						this.isIf = false
					}
					if(res.data.data.islike == 1){
						this.isShow2 = false
						this.isIf2 = true
					}else{
						this.isShow2 = true
						this.isIf2 = false
					}
				})
			},
			fabulous:function(){
				this.$axios.post('http://chonghekj.com/daily/index.php/Home/daily/doAct',this.$qs.stringify({
					pid:this.$route.query.id,
					uid:this.id,
					access_token:this.access_token,
					acttype:'like'
				}))
				.then((res)=>{
					console.log(res)
					this.getSee()
				})
			},
			Jump:function(){
				this.$router.push({
					path:'/'
				})
			}
		}
	}
</script>

<style lang="less">
	.floor{
		background: #FAFAFA;
	}
	.img-place-holder{
		height: 300px!important;
	}
	.floor_sub{
		width: 100%;
		height: 50px;
		position: fixed;
		display: flex;
		bottom: 0;
		background: #F3F3F3;
		.one{
			flex: 1;
			text-align: center;
			padding-top: 13px;
			position: relative;
			i{
				width: 26px;
				height: 26px;
				display: inline-block;
				background: url(../assets/jiantou_logo.png) no-repeat;
				background-size: 100% 100%;
			}
			.shu{
				position: absolute;
				width: 1px;
				height: 33px;
				background: #5F6368;
				right: 0;
				top: 10px;
			}
		}
		.two{
			flex: 1;
			text-align: center;
			padding-top: 12px;
			i{
				width: 26px;
				height: 26px;
				display: inline-block;
				background: url(../assets/xinxi.png) no-repeat;
				background-size: 100% 100%;
			}
		}
		.three{
			flex: 1;
			text-align: center;
			padding-top: 12px;
			position: relative;
			.three_one{
				width: 28px;
				height: 28px;
				display: inline-block;
				background: url(../assets/dianzan.png) no-repeat;
				background-size: 100% 100%;
			}
			.three_two{
				width: 28px;
				height: 28px;
				display: inline-block;
				background: url(../assets/dianzanwan.png) no-repeat;
				background-size: 100% 100%;
			}
			div{
				position: absolute;
				top: 4px;
				left: 50px;
			}
		}
		.four{
			flex: 1;
			text-align: center;
			padding-top: 12px;
			.four_one{
				width: 28px;
				height: 28px;
				display: inline-block;
				background: url(../assets/shoucang.png) no-repeat;
				background-size: 100% 100%;
			}
			.four_two{
				width: 28px;
				height: 28px;
				display: inline-block;
				background: url(../assets/shoucangwan.png) no-repeat;
				background-size: 100% 100%;
			}
		}
		.five{
			flex: 1;
			text-align: center;
			padding-top: 12px;
			i{
				width: 28px;
				height: 28px;
				display: inline-block;
				background: url(../assets/fenxiang.png) no-repeat;
				background-size: 100% 100%;
			}
		}
	}
	.box8{
		width: 100%;
		height: 50px;
	}
</style>

<style>
	article,
	aside,
	details,
	figcaption,
	figure,
	footer,
	header,
	hgroup,
	main,
	nav,
	section,
	summary {
		display: block;
	}

	audio,
	canvas,
	video {
		display: inline-block;
	}

	audio:not([controls]) {
		display: none;
		height: 0;
	}

	html {
		font-family: sans-serif;
		-webkit-text-size-adjust: 100%;
	}

	body {
		font-family: 'Helvetica Neue', Helvetica, Arial, Sans-serif;
		background: #fff;
		padding-top: 0;
		margin: 0;
	}

	a:focus {
		outline: thin dotted;
	}

	a:active,
	a:hover {
		outline: 0;
	}

	h1 {
		margin: .67em 0;
	}

	h1,
	h2,
	h3,
	h4,
	h5,
	h6 {
		font-size: 16px;
	}

	abbr[title] {
		border-bottom: 1px dotted;
	}

	hr {
		box-sizing: content-box;
		height: 0;
	}

	mark {
		background: #ff0;
		color: #000;
	}

	code,
	kbd,
	pre,
	samp {
		font-family: monospace, serif;
		font-size: 1em;
	}

	pre {
		white-space: pre-wrap;
	}

	q {
		quotes: \201C\201D\2018\2019;
	}

	small {
		font-size: 80%;
	}

	sub,
	sup {
		font-size: 75%;
		line-height: 0;
		position: relative;
		vertical-align: baseline;
	}

	sup {
		top: -0.5em;
	}

	sub {
		bottom: -0.25em;
	}

	img {
		border: 0;
		vertical-align: middle;
		color: transparent;
		font-size: 0;
	}

	svg:not(:root) {
		overflow: hidden;
	}

	figure {
		margin: 0;
	}

	fieldset {
		border: 1px solid silver;
		margin: 0 2px;
		padding: .35em .625em .75em;
	}

	legend {
		border: 0;
		padding: 0;
	}

	table {
		border-collapse: collapse;
		border-spacing: 0;
		overflow: hidden;
	}

	a {
		text-decoration: none;
	}

	blockquote {
		border-left: 3px solid #D0E5F2;
		font-style: normal;
		display: block;
		vertical-align: baseline;
		font-size: 100%;
		margin: .5em 0;
		padding: 0 0 0 1em;
	}

	ul,
	ol {
		padding-left: 20px;
	}
	
	.picture2{
		height: 300px;
		width: 100%;
	}
	.main-wrap {
		max-width: 100%;
		min-width: 300px;
		margin: 0 auto;
	}

	.content-wrap {
		overflow: hidden;
		background-color: #f9f9f9;
	}

	.content-wrap a {
		word-break: break-all;
	}

	.headline {
		border-bottom: 4px solid #f6f6f6;
	}

	.headline-title.onlyheading {
		margin: 20px 0;
	}

	.headline img {
		max-width: 100%;
		vertical-align: top;
	}

	.headline-background-link {
		line-height: 2em;
		position: relative;
		display: block;
		padding: 20px 45px 20px 20px !important;
	}

	.icon-arrow-right {
		position: absolute;
		top: 50%;
		right: 20px;
		background-image: url(http://static.daily.zhihu.com/img/share-icons.png);
		background-repeat: no-repeat;
		display: inline-block;
		vertical-align: middle;
		background-position: -70px -20px;
		width: 10px;
		height: 15px;
		margin-top: -7.5px;
	}

	.headline-background .heading {
		color: #999;
		font-size: 15px !important;
		margin-bottom: 8px;
		line-height: 1em;
	}

	.headline-background .heading-content {
		color: #444;
		font-size: 17px !important;
		line-height: 1.2em;
	}

	.headline-title {
		line-height: 1.2em;
		color: #000;
		font-size: 22px;
		margin: 20px 0 10px;
		padding: 0 20px !important;
		font-weight: bold;
	}

	.meta {
		white-space: nowrap;
		text-overflow: ellipsis;
		overflow: hidden;
		font-size: 16px;
		color: #b8b8b8;
	}

	.meta .source-icon {
		width: 20px;
		height: 20px;
		margin-right: 4px;
	}

	.meta .time {
		float: right;
		margin-top: 2px;
	}

	.content {
		color: #444;
		line-height: 1.6em;
		font-size: 17px;
		margin: 10px 0 20px;
	}

	.content img {
		max-width: 100%;
		display: block;
		margin: 30px auto;
	}

	.content img+img {
		margin-top: 15px;
	}

	.content img[src*="zhihu.com/equation"] {
		display: inline-block;
		margin: 0 3px;
	}

	.content a {
		color: #259;
	}

	.content a:hover {
		text-decoration: underline;
	}

	.view-more {
		margin-bottom: 25px;
		text-align: center;
	}

	.view-more a {
		font-size: 16px;
		display: inline-block;
		width: 125px;
		height: 30px;
		line-height: 30px;
		background: #f0f0f0;
		color: #B8B8B8;
	}

	.question {
		overflow: hidden;
		padding: 0 20px !important;
	}

	.question+.question {
		border-top: 5px solid #f6f6f6;
	}

	.question-title {
		line-height: 1.4em;
		color: #000;
		font-weight: 700;
		font-size: 18px;
		margin: 20px 0;
	}

	.meta .author {
		color: #444;
		font-weight: 700;
	}

	.answer+.answer {
		border-top: 2px solid #f6f6f6;
		padding-top: 20px;
	}

	.footer {
		text-align: center;
		color: #b8b8b8;
		font-size: 13px;
		padding: 20px 0;
	}

	.footer a {
		color: #b8b8b8;
	}

	.question .view-more a {
		width: 100%;
		display: block;
	}

	.hot-comment {
		-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
	}

	.comment-label {
		font-size: 16px;
		color: #333;
		line-height: 1.5em;
		font-weight: 700;
		border-top: 1px solid #eee;
		border-bottom: 1px solid #eee;
		margin: 0;
		padding: 9px 20px;
	}

	.comment-list {
		margin-bottom: 20px;
	}

	.comment-item {
		font-size: 15px;
		color: #666;
		border-bottom: 1px solid #eee;
		padding: 15px 20px;
	}

	.comment-meta {
		position: relative;
		margin-bottom: 10px;
	}

	.comment-meta .author {
		vertical-align: middle;
		color: #444;
	}

	.comment-meta .vote {
		position: absolute;
		color: #b8b8b8;
		font-size: 12px;
		right: 0;
	}

	.night .comment-label {
		color: #b8b8b8;
		border-top: 1px solid #303030;
		border-bottom: 1px solid #303030;
	}

	.night .comment-item {
		color: #7f7f7f;
		border-bottom: 1px solid #303030;
	}

	.icon-vote,
	.icon-voted {
		background-repeat: no-repeat;
		display: inline-block;
		vertical-align: 0;
		width: 11px;
		height: 12px;
		margin-right: 4px;
		background-image: url(http://static.daily.zhihu.com/img/app/Comment_Vote.png) !important;
	}

	.icon-voted {
		background-image: url(http://static.daily.zhihu.com/img/app/Comment_Voted.png) !important;
	}

	.night .icon-vote {
		background-image: url(http://static.daily.zhihu.com/img/app/Dark_Comment_Vote.png) !important;
	}

	.img-wrap .headline-title {
		bottom: 5px;
	}

	.img-wrap .img-source {
		right: 10px !important;
		font-size: 9px;
	}

	.global-header {
		position: static;
	}

	.button {
		width: 60px;
	}

	.button i {
		margin-right: 0;
	}

	.headline .img-place-holder {
		height: 200px;
	}

	.from-column {
		width: 280px;
		line-height: 30px;
		height: 30px;
		padding-left: 90px;
		color: #2aacec;
		background-image: url(http://static.daily.zhihu.com/img/News_Column_Entrance.png);
		box-sizing: border-box;
		margin: 0 20px 20px;
	}

	.from-column:active {
		background-image: url(http://static.daily.zhihu.com/img/News_Column_Entrance_Highlight.png);
	}

	.night .headline {
		border-bottom: 4px solid #303030;
	}

	.night img {
		-webkit-mask-image: -webkit-gradient(linear, 0 0, 0 100%, from(rgba(0, 0, 0, 0.7)), to(rgba(0, 0, 0, 0.7)));
	}

	body.night,
	.night .content-wrap {
		background: #343434;
	}

	.night .answer+.answer {
		border-top: 2px solid #303030;
	}

	.night .question+.question {
		border-top: 4px solid #303030;
	}

	.night .view-more a {
		background: #292929;
		color: #666;
	}

	.night .icon-arrow-right {
		background-image: url(http://static.daily.zhihu.com/img/share-icons.png);
		background-repeat: no-repeat;
		display: inline-block;
		vertical-align: middle;
		background-position: -70px -35px;
		width: 10px;
		height: 15px;
	}

	.night blockquote,
	.night sup {
		border-left: 3px solid #666;
	}

	.night .content a {
		color: #698ebf;
	}

	.night .from-column {
		color: #2b82ac;
		background-image: url(http://static.daily.zhihu.com/img/Dark_News_Column_Entrance.png);
	}

	.night .from-column:active {
		background-image: url(http://static.daily.zhihu.com/img/Dark_News_Column_Entrance_Highlight.png);
	}

	.large .question-title {
		font-size: 24px;
	}

	.large .meta {
		font-size: 18px;
	}

	.large .content {
		font-size: 20px;
	}

	.large blockquote,
	.large sup {
		line-height: 1.6;
	}

	.meta .meta-item {
		-o-text-overflow: ellipsis;
		width: 39%;
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
		display: inline-block;
		color: #929292;
		margin-right: 7px;
	}

	.headline .meta {
		white-space: nowrap;
		text-overflow: ellipsis;
		overflow: hidden;
		font-size: 11px;
		color: #b8b8b8;
		margin: 15px 0;
		padding: 0 20px;
	}

	.headline .meta a,
	.headline .meta a:hover {
		padding-left: 1em;
		margin-top: 2px;
		float: right;
		font-size: 11px;
		color: #0066cf;
		text-decoration: none;
	}

	.highlight {
		width: auto;
		overflow: auto;
		word-wrap: normal;
	}

	.highlight::-webkit-scrollbar {
		width: 6px;
		height: 6px;
	}

	.highlight code {
		overflow: auto;
	}

	.highlight::-webkit-scrollbar-thumb:horizontal {
		border-radius: 6px;
		background-color: rgba(0, 0, 0, .5);
	}

	.highlight::-webkit-scrollbar-thumb:horizontal:hover {
		background-color: rgba(0, 0, 0, .6);
	}

	.highlight pre {
		margin: 0;
		white-space: pre;
	}

	.highlight .hll {
		background-color: #ffc;
	}

	.highlight .err {
		color: #a61717;
		background-color: #e3d2d2;
	}

	.highlight .cp {
		color: #999;
		font-weight: 700;
	}

	.highlight .cs {
		color: #999;
		font-weight: 700;
		font-style: italic;
	}

	.highlight .gd {
		color: #000;
		background-color: #fdd;
	}

	.highlight .gi {
		color: #000;
		background-color: #dfd;
	}

	.highlight .gu {
		color: #aaa;
	}

	.highlight .ni {
		color: purple;
	}

	.highlight .nt {
		color: navy;
	}

	.highlight .w {
		color: #bbb;
	}

	.highlight .sr {
		color: olive;
	}

	[hidden],
	.button span {
		display: none;
	}

	b,
	strong,
	.highlight .k,
	.highlight .o,
	.highlight .gs,
	.highlight .kc,
	.highlight .kd,
	.highlight .kn,
	.highlight .kp,
	.highlight .kr,
	.highlight .ow {
		font-weight: 700;
	}

	dfn,
	.highlight .ge {
		font-style: italic;
	}

	.meta span,
	.meta .source {
		vertical-align: middle;
	}

	.meta .avatar,
	.comment-meta .avatar {
		width: 20px;
		height: 20px;
		border-radius: 2px;
		margin-right: 5px;
	}

	.meta .bio,
	.highlight .gh,
	.highlight .bp {
		color: #999;
	}

	.night .comment-meta .author,
	.night .content,
	.night .meta .author,
	.highlight .go {
		color: #888;
	}

	.night .headline-title,
	.night .headline-background .heading-content,
	.night .question-title {
		color: #B8B8B8;
	}

	.highlight .c,
	.highlight .cm,
	.highlight .c1 {
		color: #998;
		font-style: italic;
	}

	.highlight .gr,
	.highlight .gt {
		color: #a00;
	}

	.highlight .gp,
	.highlight .nn {
		color: #555;
	}

	.highlight .kt,
	.highlight .nc {
		color: #458;
		font-weight: 700;
	}

	.highlight .m,
	.highlight .mf,
	.highlight .mh,
	.highlight .mi,
	.highlight .mo,
	.highlight .il {
		color: #099;
	}

	.highlight .s,
	.highlight .sb,
	.highlight .sc,
	.highlight .sd,
	.highlight .s2,
	.highlight .se,
	.highlight .sh,
	.highlight .si,
	.highlight .sx,
	.highlight .s1,
	.highlight .ss {
		color: #d32;
	}

	.highlight .na,
	.highlight .nb,
	.highlight .no,
	.highlight .nv,
	.highlight .vc,
	.highlight .vg,
	.highlight .vi {
		color: teal;
	}

	.highlight .ne,
	.highlight .nf {
		color: #900;
		font-weight: 700;
	}

	.answer h1,
	.answer h2,
	.answer h3,
	.answer h4,
	.answer h5 {
		font-size: 19px;
	}

	@media only screen and (-webkit-min-device-pixel-ratio2),
	only screen and (min-device-pixel-ratio2) {
		.icon-arrow-right {
			background-image: url(http://static.daily.zhihu.com/img/share-icons@2x.png);
			-webkit-background-size: 82px 55px;
			background-size: 82px 55px;
		}

		.icon-vote,
		.icon-voted {
			background-image: url(http://static.daily.zhihu.com/img/app/Comment_Vote@2x.png) !important;
			background-size: 11px 12px;
		}

		.icon-voted {
			background-image: url(http://static.daily.zhihu.com/img/app/Comment_Voted@2x.png) !important;
		}

		.night .icon-vote {
			background-image: url(http://static.daily.zhihu.com/img/app/Dark_Comment_Vote@2x.png) !important;
		}

		.from-column {
			background-image: url(http://static.daily.zhihu.com/img/News_Column_Entrance@2x.png) !important;
			background-size: 280px 30px;
		}

		.from-column:active {
			background-image: url(http://static.daily.zhihu.com/img/News_Column_Entrance_Highlight@2x.png) !important;
		}

		.night .from-column {
			color: #2b82ac;
			background-image: url(http://static.daily.zhihu.com/img/Dark_News_Column_Entrance@2x.png) !important;
		}

		.night .from-column:active {
			background-image: url(http://static.daily.zhihu.com/img/Dark_News_Column_Entrance_Highlight@2x.png) !important;
		}
	}

	.meta .meta-item {
		width: 39%;
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
		display: inline-block;
		color: #929292;
		margin-right: 7px;
	}

	.headline .meta {
		white-space: nowrap;
		text-overflow: ellipsis;
		overflow: hidden;
		font-size: 11px;
		color: #b8b8b8;
		margin: 20px 0;
		padding: 0 20px;
	}

	.headline .meta a,
	.headline .meta a:hover {
		margin-top: 2px;
		float: right;
		font-size: 11px;
		color: #0066cf;
		text-decoration: none;
	}

	.answer h1,
	.answer h2,
	.answer h3,
	.answer h4,
	.answer h5 {
		font-size: 19px;
	}

	.origin-source,
	a.origin-source:link {
		display: block;
		margin: 25px 0;
		height: 50px;
		overflow: hidden;
		background: #f0f0f0;
		color: #888;
		position: relative;
		-webkit-touch-callout: none;
	}

	.origin-source .source-logo,
	a.origin-source:link .source-logo {
		float: left;
		width: 50px;
		height: 50px;
		margin-right: 10px;
	}

	.origin-source .text,
	a.origin-source:link .text {
		line-height: 50px;
		height: 50px;
		font-size: 13px;
	}

	.origin-source.with-link .text {
		color: #333;
	}

	.origin-source.with-link:after {
		display: block;
		position: absolute;
		border-color: transparent transparent transparent #f0f0f0;
		border-width: 7px;
		border-style: solid;
		height: 0;
		width: 0;
		top: 18px;
		right: 4px;
		line-height: 0;
		content: "";
	}

	.origin-source.with-link:before {
		display: block;
		height: 0;
		width: 0;
		position: absolute;
		top: 18px;
		right: 3px;
		border-color: transparent transparent transparent #000;
		border-width: 7px;
		border-style: solid;
		line-height: 0;
		content: "";
	}

	.origin-source-wrap {
		position: relative;
		background: #f0f0f0;
	}

	.origin-source-wrap .focus-link {
		position: absolute;
		right: 0;
		top: 0;
		width: 45px;
		color: #00a2ed;
		height: 50px;
		display: none;
		text-align: center;
		font-size: 12px;
		-webkit-touch-callout: none;
	}

	.origin-source-wrap .focus-link .btn-label {
		text-align: center;
		display: block;
		margin-top: 8px;
		border-left: solid 1px #ccc;
		height: 34px;
		line-height: 34px;
	}

	.origin-source-wrap.unfocused .focus-link {
		display: block;
	}

	.origin-source-wrap.unfocused .origin-source:before,
	.origin-source-wrap.unfocused .origin-source:after {
		display: none;
	}

	.night .origin-source-wrap {
		background: #292929;
	}

	.night .origin-source-wrap .focus-link {
		color: #116f9e;
	}

	.night .origin-source-wrap .btn-label {
		border-left: solid 1px #3f3f3f;
	}

	.night .origin-source,
	.night .origin-source.with-link {
		background: #292929;
		color: #666;
	}

	.night .origin-source .text,
	.night .origin-source.with-link .text {
		color: #666;
	}

	.night .origin-source.with-link:after {
		border-color: transparent transparent transparent #292929;
	}

	.night .origin-source.with-link:before {
		border-color: transparent transparent transparent #666;
	}

	/* ==== */
	.question-title {
		color: #494b4d;
	}

	blockquote {
		color: #9da3a6;
		border-left: 3px solid #Dfe3e6;
	}

	.content a {
		color: #4786b3;
	}

	.content {
		font-size: 17px;
		color: #616466;
	}

	.content-wrap {
		background: #fff;
	}

	hr {
		margin: 30px 0;
		border-top-width: 0;
	}


	p {
		margin: 20px 0 !important;
	}

	.dudu-night .content {
		color: #797b80;
	}

	.dudu-night hr {
		color: #27282b;
		border-color: #27282b;
	}

	.dudu-night .meta .author,
	.dudu-night .meta .bio {
		color: #555659;
	}

	.dudu-night .headline-title,
	.dudu-night .headline-background .heading-content,
	.dudu-night .question-title {
		color: #919499;
	}

	.dudu-night .headline {
		border-bottom: none;
	}

	.dudu-night img {
		-webkit-mask-image: -webkit-gradient(linear, 0 0, 0 100%, from(rgba(0, 0, 0, 0.7)), to(rgba(0, 0, 0, 0.7)));
	}

	body.dudu-night,
	.dudu-night .content-wrap {
		background: #1d1e1f;
	}

	.dudu-night .answer+.answer {
		border-top: 2px solid #27282b;
	}

	.dudu-night .question+.question {
		border-top: 4px solid #27282b;
	}

	.dudu-night .view-more a {
		background: #1d1e1f;
		color: #396280;
	}

	.dudu-night .icon-arrow-right {
		background-image: url(http://static.daily.zhihu.com/img/share-icons.png);
		background-repeat: no-repeat;
		display: inline-block;
		vertical-align: middle;
		background-position: -70px -35px;
		width: 10px;
		height: 15px;
	}

	.dudu-night blockquote,
	.dudu-night sup {
		border-left: 3px solid #2e3033;
		color: #555659;
	}

	.dudu-night .content a {
		color: #396280;
	}

	.dudu-night img {
		opacity: 0.7;
	}

	.dudu-night .from-column {
		color: #2b82ac;
		background-image: url(http://static.daily.zhihu.com/img/Dark_News_Column_Entrance.png);
	}

	.dudu-night .from-column:active {
		background-image: url(http://static.daily.zhihu.com/img/Dark_News_Column_Entrance_Highlight.png);
	}

	//绂佺敤澶撮儴涓嬮潰鐨勫垎闅旂嚎
	.dudu .headline {
		border-bottom: none;
	}

	.dudu-night .origin-source,
	.dudu-night a.origin-source:link {
		background: #222324;
	}

	.dudu-night .origin-source.with-link .text {
		color: #797b80;
	}

	.dudu-night .origin-source.with-link:after {
		border-color: transparent transparent transparent #797b80;
	}
</style>
